<template>
  <div class="app-container">
    <el-form ref="objectForm" :model="object" :rules="objectRules" label-width="150px">
      <title-container describe="资讯" />
      <div class="gpo-form mt-20">
        <el-form-item label="标题：" prop="title">
          <el-input v-model="object.title"/>
        </el-form-item>
        <el-form-item label="资讯类型：" prop="informationType">
          <el-select v-model="object.informationType" placeholder="资讯类型" clearable>
            <el-option v-for="(item, index) in informationTypes" :key = "index" :label= "item.object.name" :value="item.object.categoryName"/>
          </el-select>
        </el-form-item>
        <el-form-item label="所属范围：" prop="scope">
          <el-select v-model="object.scope" placeholder="所属范围" clearable>
            <el-option v-for="(item, index) in GLOBAL.scopeTypes" :key = "index" :label= "item" :value="item"/>
          </el-select>
        </el-form-item>
        <el-form-item label="关联楼盘：" prop="linkBuilding">
          <el-select v-model="object.linkBuilding" placeholder="关联楼盘" clearable>
            <el-option v-for="(item, index) in buildingTypes" :key = "index" :label= "item.object.buildingName" :value="item.id"/>
          </el-select>
        </el-form-item>
        <el-form-item label="文章发布时间：" prop="releaseTime">
          <!--<el-input v-model="object.releaseTime"/>-->
          <el-date-picker
            :span="8"
            v-model="object.releaseTime"
            value-format="yyyy-MM-dd"
            type="date"
            placeholder="文章发布时间"/>
        </el-form-item>
        <el-form-item label="来源：" prop="source">
          <el-input v-model="object.source"/>
        </el-form-item>
        <el-form-item label="作者：" prop="author">
          <el-input v-model="object.author"/>
        </el-form-item>
        <el-form-item label="责任编辑：" prop="editorCharge">
          <el-input v-model="object.editorCharge"/>
        </el-form-item>
        <el-form-item label="新闻简介：" prop="newsSummary">
          <el-input v-model="object.newsSummary" :rows="4" type="textarea" placeholder="请输入简介"/>
        </el-form-item>
        <el-form-item label="SEO关键字：" prop="SEOKeyword">
          <el-input v-model="object.SEOKeyword"/>
        </el-form-item>
        <el-form-item label="新闻关键字：" prop="newsKeyword">
          <el-input v-model="object.newsKeyword"/>
        </el-form-item>
        <el-form-item label="缩略图：" prop="thumb">
          <!--<el-upload-->
          <!--class="avatar-uploader"-->
          <!--:action="GLOBAL.uploadFile"-->
          <!--:show-file-list="false"-->
          <!--:on-success="handleSuccess"-->
          <!--:before-upload="handleRemove">-->
          <!--<img v-if="object.thumb" :src="object.thumb" class="avatar">-->
          <!--<i v-else class="el-icon-plus avatar-uploader-icon"></i>-->
          <!--</el-upload>-->
          <single-image
            :images="fileList"
            :time="false"
            @success="setImage"/>
        </el-form-item>
        <el-form-item label="内容编辑：" prop="articleContent">
          <div class="editor-container">
            <Tinymce ref="editor" :height="200" v-model="object.articleContent" />
          </div>
        </el-form-item>
      </div>
    </el-form>
    <div class="gpo-btn text-center" >
      <el-button type="primary" class="gpo-btn_small" @click="onBack">返回</el-button>
      <el-button type="primary" class="gpo-btn_small" @click="onSubmit(message)">提交</el-button>
    </div>
  </div>
</template>
<script>
import TitleContainer from '@/components/GpoCommon/TitleContainer'
import Tinymce from '@/components/Tinymce'
import SingleImage from '@/components/Upload/singleImage'
import mixin from './rules/news.js'
export default {
  name: 'CreateNews',
  components: { TitleContainer, Tinymce, SingleImage },
  mixins: [mixin],
  data() {
    return {
      message: '新增资讯',
      images: [],
      fileList: [],
      informationTypes: [], // 分类
      buildingTypes: [], // 楼盘
      object: {
        'title': '',
        'informationType': '',
        'scope': '',
        'linkBuilding': '',
        'releaseTime': '',
        'source': '',
        'author': '',
        'editorCharge': '',
        'newsSummary': '',
        'SEOKeyword': '',
        'newsKeyword': '',
        'pictureList': [],
        'articleContent': '',
        'status': 1,
        'level2': '',
        'level1': '',
        'level': 'fy_newsDissemination'
      }
    }
  },
  created() {
    if (this.$route.params.id) {
      this.message = '修改楼盘'
      this.getDateById(this.$route.params.id).then(() => {
        // todo 后续操作 例如图片初始化
        // console.log(this.object)
      })
    }
    // 初始化分类内容
    let query = {
      level: 'informationClassification',
      pageSize: 10,
      pageNum: 1
    }
    query = this.setListQuery(query)
    this.searchListAll(query).then((res) => {
      this.informationTypes = res.data.list
    })
    // 初始化楼盘
    let query1 = {
      level: 'building',
      pageSize: 10,
      pageNum: 1
    }
    query1 = this.setListQuery(query1)
    this.searchListAll(query1).then((res) => {
      this.buildingTypes = res.data.list
    })
  },
  methods: {
    // 上传多图
    setImage(file) {
      const _this = this
      if (file.length === 0) {
        this.object.pictureList = []
        return
      }
      this._.forEach(file, function(f) {
        _this.object.pictureList.push(
          {
            pictureUrl: f.imgUrl
          }
        )
      })
    }
  }
}
</script>
